<template>
	<div>
		<!--学生详细成绩-->
		<div style="position: relative;background-color: white;width: 100%;padding: 10px 10px 10px 10px;">
			<div style="display: inline-block;">
				<i style="font-size:45px;" class="alicon icon-wode"></i>
			</div>
			<div style="display: inline-block;">
				<div style="font-size: 15px;">张某某</div>
				<div style="font-size: 12px;color: #666666;">高三2班</div>
			</div>
			<span style="position: absolute;right: 20px;">20180868</span>
			<!--<div style="display: inline-block;">
				20180868
			</div>-->
		</div>
		<!--<ul class="mui-table-view">
			<li @click="toggle" class="mui-table-view-cell">
				<i slot="icon" class="alicon icon-shaixuan" style="font-size: 20px;position:relative;top: 2px;"></i>
				<span  class="mui-navigate-right">筛选：{{department}} | {{+subject}} | {{teacher}}</span>
			</li>
		</ul>
        <mt-popup v-model="popupVisible" :modal="false" class="mint-popup" position="top">
        	<div :style="pophightclass" >
        		<div style="padding: 14px 25px 60px 25px;">
        			<div style="color: #666666;font-size: 12pt;">部门</div>
    				<div v-for="item in 10" style="width: 25%;text-align: center;display: inline-block;">
        				<div style="margin: 0 auto;font-size: 12pt;width: 75px;height: 36px;margin-top:7px;background-color: #F4F4F4;border:1px solid #e9eaec;line-height: 36px;border-radius: 5px;text-align: center;">
	 						呜呜呜
	 					</div>
        			</div>
        			
        			<hr style="margin:10px 0px 10px 0px;width: 100%;background-color: rgba(240,240,240,1);border: none;height: 1px;" />
        			<div style="color: #666666;font-size: 12pt;">科目</div>
    				<div v-for="item in 10" style="width: 25%;text-align: center;display: inline-block;">
        				<div style="margin: 0 auto;font-size: 12pt;width: 75px;height: 36px;margin-top:7px;background-color: #F4F4F4;border:1px solid #e9eaec;line-height: 36px;border-radius: 5px;text-align: center;">
	 						语文
	 					</div>
        			</div>
        			
        			<hr style="margin:10px 0px 10px 0px;width: 100%;background-color: rgba(240,240,240,1);border: none;height: 1px;" />
        			<div style="color: #666666;font-size: 12pt;">教师</div>
    				<div v-for="item in 40" style="width: 25%;text-align: center;display: inline-block;">
        				<div style="margin: 0 auto;font-size: 12pt;width: 75px;height: 36px;margin-top:7px;background-color: #F4F4F4;border:1px solid #e9eaec;line-height: 36px;border-radius: 5px;text-align: center;">
	 						教师
	 					</div>
        			</div>
        		</div>
        		
        		<div style="position: fixed;bottom: 102px;width: 100%;">
        			<mt-button  style="float: left;height:49px;border-radius: 0px;width:50%;background-color: white;color: #999999;">取消</mt-button>
					<mt-button  style="float: left;height:49px;border-radius: 0px;width:50%;background-color: #517EDB;color: white;">确定</mt-button>
        		</div>
        	</div>
        </mt-popup>-->
        <div style="width: 100%;height: 7px;background-color: #f5f5f5;"></div>
        <div v-for="item in 10" style="background-color: white;">
        	<div style="padding: 20px 20px 20px 20px;">
        		<div style="text-align: center;">
	           		<div style="display: inline-block;width: 69%;">
	           			<div style="text-align: left;">总成绩</div>
	           		</div>
	           		<div style="display: inline-block;width: 19%;">
	           			<div style="">659分</div>
	           		</div>
	           		<div style="display: inline-block;width: 9%;">
	           			<div style=""><i style="top:3px;position: relative;" class="alicon icon-xiala1"></i></div>
	           		</div>
	           	</div>
	           	<div style="text-align: left;margin-top: 10px;">
	           		<div style="display: inline-block;width: 30%;">
	           			<div style="color:#999999;text-align: left;">班级排名：12</div>
	           		</div>
	           		<div style="display: inline-block;width: 30%;">
	           			<div style="color:#999999;text-align: left;">年段排名：12</div>
	           		</div>
	           	</div>
        	</div>
           	
           	
           	<div v-show="true" style="text-align: center;background-color: #FAFAFA;padding: 10px">
           		<div style="display: inline-block;width: 31%;">
           			<div >134</div>
           			<div style="color: #888888;font-size: 13px;">标准分</div>
           		</div>
           		<div style="display: inline-block;width: 31%;">
           			<div >A-B</div>
           			<div style="color: #888888;font-size: 13px;">横向等级</div>
           		</div>
           		<div style="display: inline-block;width: 31%;">
           			<div >B-C</div>
           			<div style="color: #888888;font-size: 13px;">纵向等级</div>
           		</div>
           	</div>
       </div>
        
	</div>
</template>

<script>
	import api from "@/components/js/Apidomain.js"
	import { getsessionstorage } from '@/components/js/Localstorage'
	import { Toast } from 'mint-ui';
	export default{
		data(){
			return{
				popupVisible:false,			//选择框的显示隐藏
				department:"初中",				//部门
				subject:"语文",					//科目
				teacher:"呜呜呜",					//教师
			}
		},
		computed:{
        	pophightclass: function() {
				return {
					overflow: 'scroll',
					height: document.documentElement.clientHeight - 45+ "px",
				}
			},
        },
        created() {
            this.getStudentResult()
        },
        mounted() {
           
        },
		methods:{
			toggle:function(){
        		if(this.popupVisible){
        			this.popupVisible = false;
        		}else{
        			this.popupVisible = true;
        		}
        	},
        	getStudentResult:function(){
        		let roleId = getsessionstorage('roleid')
        		let schoolYearStart = getsessionstorage('schoolYearStart')
        		let analysisId = getsessionstorage('analysisId')
        		let url = api.apidomain + '/tqes/web/squaAnalysisExamDetail/getStudentDetail';
                this.$http.post(url, {
                        "roleId": roleId,
                        "schoolYearStart":schoolYearStart,
                        "analysisId":analysisId
                    }).then(function(response) {
                        if(response.data.success == true) {
						console.log(response.data.data)
                            
                        } else if(response.data.success == false) {
                            Toast({
                                message: response.data.msg,
                                position: 'middle',
                                duration: 2000
                            });
                        }

                    })
                    .catch(function(error) {
                        Toast({
                            message: '系统发生错误',
                            position: 'middle',
                            duration: 2000
                        });
                    });
        	}
		}
	}
</script>

<style scoped>
	.mint-popup {
		margin-top:102px;
        width: 100%;
        height: 100%;
        background-color: #fff;
    }
</style>